<template>
  <!-- 预览文件 -->
  <div class="app-container home">
    <h2>
      <img src="/favicon.ico" alt="icon" height="20" width="20" />Yimi<i
        class="el-icon-link"
      />
    </h2>
    <p>
      <a
        target="_blank"
        style="color: #409eff"
        href="https://gitee.com/uublue/yimi-doc"
      >
        Yimi </a
      >是一个基于Spring + Vue的web应用开发框架。
    </p>
    <p>主要亮点：</p>
    <ul>
      <li>基于资源管理的访问控制，权限编码支持通配符</li>
      <li>菜单和页面接口数据，一键扫描生成</li>
      <li>
        NPM脚手架辅助创建项目，可以按需定制，比如前端可以选择是否使用TypeScript
      </li>
      <li>一套代码，既支持单体应用，又支持微服务应用</li>
      <li>系统参数配置功能，定义方法简单易用，支持复杂的值类型</li>
    </ul>
    <p>
      <el-tag type="danger">&yen;免费开源</el-tag>
    </p>

    <el-divider />
    <h2>微前端<i class="el-icon-link" /></h2>
    <p>
      微前端技术的兴起，解决了前端项目技术栈升级过程中的大问题，能帮助你从已有项目过渡到使用新技术栈开发的项目。Yimi已经准备好了相应的微前端基座，用NPM脚手架可以轻松搭建微前端环境。
    </p>
  </div>
</template>

<script lang="ts">
export default {
  name: "DashboardView",
};
</script>
<style scoped>
.home {
  blockquote {
    padding: 10px 20px;
    margin: 0 0 20px;
    font-size: 17.5px;
    border-left: 5px solid #eee;
  }

  

  font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 13px;
  color: #676a6c;
  overflow-x: hidden;

  h4 {
    margin-top: 0px;
  }

  p {
    margin-top: 10px;

    b {
      font-weight: 700;
    }
  }
}
</style>
